body {
    height: 100vh;
    margin: 0px;
    padding: 0px;
    overflow: hidden;
    align-items: center;
    display: flex;
    justify-content: center;
}
.body1 {
    height: 100vh;
    margin: 0px;
    padding: 0px;
    overflow: hidden;
    text-align: center;
}
.card1 {
    position: absolute;
    text-align: center;
    width: 936px;
    height: 500px;
    border: #bbbbbb solid 1px;
    border-radius: 50px;
    background: #f9f7f7;
    box-shadow: 15px 15px 20px 2px #444444;
    z-index: 2;
}

.card2 {
    position: absolute;
    margin-left: 150px;
    text-align: center;
    width: 936px;
    height: 500px;
    border: #bbbbbb solid 1px;
    border-radius: 50px;
    background: #DBE2EF;
    box-shadow: 15px 15px 20px 2px #444444;
    z-index: 1; /* 确保card2层级低于card1 */
}

.card3 {
    margin: auto;
    text-align: center;
    justify-content: center;
    width: 936px;
    height: 700px;
    border: #bbbbbb solid 1px;
    border-radius: 50px;
    background: #DBE2EF;
    box-shadow: 15px 15px 20px 2px #444444;
    z-index: 1; /* 确保card2层级低于card1 */
}
.card4{
    margin: auto;
    text-align: center;
    justify-content: center;
    width: 936px;
    height: 700px;
    border: #bbbbbb solid 1px;
    border-radius: 15px;
    background: #DBE2EF;
    box-shadow: 15px 15px 20px 2px #444444;
    z-index: 1; /* 确保card2层级低于card1 */
}
.row{
    display: flex;
    text-align: center;
    justify-content: center; /* 水平居中 */
    width: 100%; /* 确保 .row 占满整个 .body1 的宽度 */
    height: 100vh; /* 确保 .row 占满整个 .body1 的高度 */
}